import { createStore, Store, useStore as baseUserStore } from "vuex";
import { saveLanguageApi } from "@/api/layout"
import { InjectionKey } from 'vue'
import { fetchRoomList } from '@/api/home'
import { fetchRoomDetail } from '@/api/detail'
import { IRoomListParams, IRoomDetailParams } from '@/api/interface'
// 为 store state 声明类型
export interface AllStateTypes {
    count: number,
    locale: any,
    userStatus: number,
    roomList: Array<any>
    pageNo: number,
    pageSize: number,
    total: number,
    cityCode: string,
    roomDetail: any,
    roomId: null,
    orderVisible: boolean
}

// 定义 injection key
export const key: InjectionKey<Store<AllStateTypes>> = Symbol('storeKey')


// baseUserStore表示原始vuex的useStore方法
export function useStore() {
    return baseUserStore(key)
}


export function createSSRStore() {
    return createStore<AllStateTypes>({
        state: {
            count: 1,
            locale: null, //语言包
            userStatus: 0, //登录态,
            roomList: [],
            pageNo: 1,
            pageSize: 6,
            total: 0,
            cityCode: 'hz',
            roomDetail: {},
            roomId: null,
            orderVisible: false
        },
        mutations: {
            setCount(state, payload) {
                state.count = payload;
                return state.count
            },

            setLocale(state, payload) {  //设置语言包
                state.locale = payload;
                return state.locale
            },
            setUserStatus(state, payload) { //设置登录态
                console.log(state);
                state.userStatus = payload;
                return state.userStatus
            },
            setRoomList(state, payload) { //设置房屋列表数据
                state.roomList = payload
                return state.roomList
            },
            setRoomDetail(state, payload) { //设置房屋列表详情
                state.roomDetail = payload
                return state.roomList
            },
            setRoomId(state, payload) { //设置房屋列表ID
                state.roomId = payload
                return state.roomId
            },
            // 
            setOrderVisible(state, payload) {
                state.orderVisible = payload
                return state.orderVisible
            }
        },
        actions: {
            fetchCont({ commit, state }, payload) {
                commit('setCount', payload)
            },
            // TODO:保存当前语言包
            saveLanguage({ commit }, Language: any) {
                saveLanguageApi(Language.name).then(res => {
                    let { success } = res
                    if (success) {
                        commit('setLocale', Language.name)
                        console.log("保存当前语言包成功");
                    }
                })
            },
            // 列表接口
            getRoomList({ state, commit }, payload: IRoomListParams) {
                // let { pageNo } = payload
                let { pageNo, cityCode = state.cityCode } = payload
                state.pageNo = pageNo
                const params = {
                    pageNo,
                    pageSize: state.pageSize,
                    cityCode
                }
                return new Promise((resolve) => {
                    fetchRoomList(params).then(res => {
                        let { success, result } = res
                        let orders = result.orders
                        const total = result.total
                        if (success) {
                            commit('setRoomList', orders.data)
                            console.log("保存到vuex中", orders.data);
                            state.total = total
                            resolve(true)
                        }
                    })
                })
            },
            // 详情接口
            getRoomDetail({ state, commit }, payload: IRoomDetailParams) {
                // let { id } = payload
                return new Promise((resolve) => {
                    fetchRoomDetail(payload).then(res => {
                        let { success, result } = res
                        const total = result.total
                        if (success) {
                            commit('setRoomDetail', result)
                            console.log("详情页数据保存在vuex中国", result);
                            state.total = total
                            resolve(true)
                        }
                    })
                })
            }
        }
    })
}